<!--
 * @Author: GL
 * @Date: 2022-09-23 00:25:35
 * @LastEditors: GL
 * @LastEditTime: 2023-04-05 02:10:56
 * @Description: des
-->
<template>
  <div class="aside">
    <el-menu active-text-color="#ffd04b" background-color="#545c64" class="el-menu-vertical-demo" default-active="1"
      text-color="#fff">
      <el-menu-item index="1" @click="product">首页</el-menu-item>
      
      <el-menu-item index="2" @click="report">
        <span>用户管理</span>
      </el-menu-item>
      <el-menu-item index="3" @click="system">
        <span>商品管理</span>
      </el-menu-item>
      <el-menu-item index="4" @click="content">
        <span>内容推荐</span>
      </el-menu-item>
      <el-sub-menu index="5">
        <template #title>
          <span>旅游管理</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="5-1" @click="session">场次管理</el-menu-item>
          <el-menu-item index="5-2" @click="scenic">景区列表管理</el-menu-item>
          <el-menu-item index="5-3" @click="equipment">验票设备查询</el-menu-item>
        </el-menu-item-group>
      </el-sub-menu>
      <el-sub-menu index="6">
        <template #title>
          <span>全域地图</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="6-1">景区管理</el-menu-item>
          <el-menu-item index="6-2">景点管理</el-menu-item>
          <el-menu-item index="6-3">景点管理</el-menu-item>
          <el-menu-item index="6-4">路线管理</el-menu-item>
          <el-menu-item index="6-5">游客救助</el-menu-item>
        </el-menu-item-group>
      </el-sub-menu>
    </el-menu>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
  methods: {
    handleOpen(par) {
      console.log(par);
    },
    // 旅游管理
    product() { this.$router.push('/home/product') },
    session() { this.$router.push('/home/session') },
    scenic() { this.$router.push('/home/scenic') },
    equipment() { this.$router.push('/home/equipment') },
    // 报表管理
    report() { this.$router.push('/home/report') },
    // 系统管理
    system() { this.$router.push('/home/system') },
    // 内容 推荐
    content() { this.$router.push('/home/content') },
    // TODO 区域地图
  },
};
</script>

<style lang="scss" scoped>
.aside {
  padding-top: 20px;
  background-color: #545c64;
  display: flex;
  flex-direction: column;
  color: #ffffff;
  text-align: center;
  line-height: 40px;
  overflow: hidden;

  .el-menu {
    height: 87vh;
  }
}
</style>